<template>
	<view class="content">
		<CustomNav  :isBack="true" :custom="custom" :title="'查看面试邀请'"></CustomNav>
		<view :style="'margin-top:'+(custom.statusBar+custom.nvaMartom+custom.navHeight+60)+'rpx;'" class="name">{{title}}</view>
		<view class="info-block">
			<view class="company-block">
				<image :src="detail.comRecruiters.enterprise.logoUrl?detail.comRecruiters.enterprise.logoUrl:imageUrl+'/job_hunting/job_detail/enterprise.jpg'" class="company-logo"></image>
				<view class="company-info">
					<view class="company-name">{{detail.comRecruiters.enterprise.brandName}}</view>
					<view class="hr-info">
						<image :src="detail.comRecruiters.user.faceUrl" class="hr-photo"></image>
						<view v-show="detail.comRecruiters" class="hr-name">{{detail.comRecruiters.realName}} · {{detail.comRecruiters.comPosition}}</view>
					</view>
				</view>
			</view>
			<view class="interview-block">
				<view class="info-item">
					<view class="info-label">时间</view>
					<view class="info-value">{{detail.interviewTime}}</view>
				</view>
				<view class="info-item">
					<view class="info-label">职位</view>
					<view v-show="detail.jobPublish" class="info-value">{{detail.jobPublish.jobTitle}} · {{detail.jobPublish.minSalary}}-{{detail.jobPublish.maxSalary}}元</view>
				</view>
				<view class="info-item">
					<view class="info-label">联系人</view>
					<view class="info-value">{{detail.comRecruiters.realName}}</view>
					<view v-if="!isMine" @click="call()" class="call"><view class="iconfont icon-dianhuatianchong"></view>呼叫</view>
				</view>
			</view>
		</view>
		<view v-if="detail.plan==1&&!isMine" class="button-block">
			<view @click="handleInterview(1)" class="button refuse">拒绝面试</view>
			<view @click="handleInterview(2)" class="button success">接受面试</view>
		</view>
	</view>
</template>

<script>
	import CustomNav from '../components/CustomNav/CustomNav';
	import {getInterview,submitInterview} from '@/api/interview.js';
	import {getCustomNavData} from '@/util/util.js'
	export default{
		data(){
			return{
				custom:null,
				id:null,
				isMine:false,
				detail:{
					
				},
				title:'',
				imageUrl:'',
				userID:'',//对方userID
			}
		},
		methods:{
			//打电话
			call(){
				uni.makePhoneCall({
					phoneNumber:this.detail.comRecruiters.user.mobile
				})
			},
			//获取面试信息
			getInterviewDetail(id){
				uni.showLoading({
					title:'加载中',
					mask:true,
				})
				getInterview({id}).then((res)=>{
					uni.hideLoading()
					this.detail=res;
					this.getTitle();
				}).catch((res)=>{
					uni.hideLoading()
					this.showToast('加载失败，请稍后重试',()=>{
						uni.navigateBack()
					})
				})
			},
			getTitle(){
				let title='';
				const plan=this.detail.plan;
				const isMine=this.isMine;
				switch(plan){
					case 1:
						title=isMine?'面试邀请已发送，等待对方回应':'对方邀请您视频面试';
						break;
					case 2:
						title=isMine?'对方已同意面试邀请，请按时参加':'您已同意面试邀请，请按时参加';
						break;
					case 3:
						title='面试已结束';
						break;
					case 4:
						title=isMine?'对方拒绝了面试邀请':'您拒绝了面试邀请';
						break;
				}
				this.title=title;
			},
			//处理同意和拒绝逻辑
			handleInterview(type){
				let plan;
				let para={
					cancelText:'我再想想',
					success:(confirm)=>{
						if(confirm.confirm){
							uni.showLoading({
								title:'提交中',
								mask:true
							})
							submitInterview({id:this.id,plan}).then((res)=>{
								const agree=plan==4?false:true;
								const message=uni.$TUIKit.createTextMessage({
									to:this.userID,
									conversationType:uni.$TUIKitTIM.TYPES.CONV_C2C,
									payload:{
										text:plan==4?'拒绝面试邀请':'接受面试邀请'
									}
								})
								uni.$TUIKit.sendMessage(message).then((messageRes)=>{
									uni.$emit('updateMessageList',message)
									uni.$emit('interviewHandle',{agree,id:this.id});
									this.showToast('操作成功',()=>{
										uni.navigateBack()
									})
								}).catch(()=>{
									this.showToast('操作失败，请重试！');
								})
							}).catch((res)=>{
								uni.hideLoading();
								this.showToast('操作失败')
							})
						}
					}
				}
				if(type==1){
					plan=4;
					para.title='提示';
					para.content='确定拒绝面试吗'
					para.confirmText='我确定';
				}else{
					plan=2;
					para.title='面试诚信原则';
					para.content='面试前3小时，双方可申请取消\n如不取消，请按时出席\n爽约乙方，平台会打【不良记录】'
					para.confirmText='不爽约';
				}
				uni.showModal(para);
			}
		},
		components:{
			CustomNav,
		},
		onLoad(e) {
			this.userID=e.userID;//对方userID，只能在非发起者时使用
			this.custom=getCustomNavData();
			this.id=e.id;//面试的id
			this.isMine=e.isMine=='true'?true:false;//是否为发起者
			this.imageUrl=this.globalConfig.imageUrl;
			this.getInterviewDetail(e.id);
		}
	}
</script>

<style lang="scss" scoped>
	.content{
		background: linear-gradient(#fc0a3a,#f8f8f8,#f8f8f8,#f8f8f8);
		overflow: hidden;
		min-height: 100vh;
	}
	.name{
		font-size: 42rpx;
		color: #fff;
		position: relative;
		padding:0  40rpx;
		font-weight: bold;
		margin-bottom: 40rpx;
	}
	.info-block{
		width: calc(100% - 60rpx);
		margin: 0 auto;
		background: #fff;
		border-radius: 16rpx;
		margin-top: 40rpx;
		padding: 40rpx;
		.company-block{
			display: flex;
			flex-direction: row;
			padding-bottom: 30rpx;
			border-bottom: 1px solid #efefef;
			align-items: center;
			.company-logo{
				width: 125rpx;
				height: 125rpx;
				border-radius: 8rpx;
				margin-right: 20rpx;
			}
			.company-info{
				height: 125rpx;
				flex-grow: 1;
				display: flex;
				flex-direction: column;
				justify-content: space-between;
				.company-name{
					font-size: 36rpx;
					font-weight: bold;
				}
				.hr-info{
					display: flex;
					flex-direction: row;
					align-items: center;
					.hr-photo{
						width: 50rpx;
						height: 50rpx;
						border-radius: 50%;
					}
					.hr-name{
						font-size: 26rpx;
					}
				}
			}
		}
		.interview-block{
			width: 100%;
			.info-item{
				display: flex;
				flex-direction: row;
				align-items: center;
				height: 80rpx;
				.info-label{
					width:130rpx;
					color: #404040;
				}
				.info-value{
					flex-grow: 1;
					overflow: hidden;
					text-overflow:ellipsis;
					white-space: nowrap;
				}
				.iconfont{
					color: #999;
					font-size: 28rpx;
				}
			}
			.info-item:nth-child(3){
				.info-value{
					flex-grow: 0;
				}
				.call{
					display: flex;
					margin-left: 12rpx;
					flex-direction: row;
					align-items: center;
					color: #ff7626;
					border-radius: 10rpx;
					border: 1px solid #ff7626;
					font-size: 28rpx;
					padding:5rpx 10rpx;
					.iconfont{
						color: #ff7626;
						font-size: 28rpx;
						margin-right: 6rpx;
						font-weight: bold;
					}
				}
			}
		}
	}
	.button-block{
		position: fixed;
		bottom: 0;
		display: flex;
		flex-direction: row;
		justify-content: center;
		padding: 30rpx;
		width: 100%;
		background: #fff;
		.button{
			width:calc(70% - 16rpx);
			height: 90rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			color: #fff;
			font-size: 32rpx;
			border-radius: 10rpx;
			background:#ff7626;
			font-weight: bold;
		}
		.button.refuse{
			width: calc(30% - 16rpx);
			color: #000;
			background:#efefef;
			margin-right: 20rpx;
		}
	}
</style>